<template>
	<view class="imShowWrapper" @click="isBottomMore = false">
		<view class="imListWrapper">
			<view class="menu">
				<view class="menuItem" @click="openExchangMobileDialog">
					<image class="img1" src="@/im/static/img/menu1.png"></image>
					<view class="text">交换电话</view>
				</view>
				<view class="menuItem" @click="openExchangWechatDialog">
					<image class="img2" src="@/im/static/img/menu2.png"></image>
					<view class="text">交换微信</view>
				</view>

				<view class="menuItem" v-if="LoginType == 1" @click="handleInvitation">
					<image class="img3" src="@/im/static/img/menu3.png"></image>
					<view class="text">面试邀请</view>
				</view>
				<view class="menuItem" v-if="LoginType == 1" @click="handleToResume">
					<image class="img4" src="@/im/static/img/menu4.png"></image>
					<view class="text">查看简历</view>
				</view>

				<view class="menuItem" v-if="LoginType == 2" @click="openTopMenuDialog">
					<image class="img5" src="@/im/static/img/menu5.png"></image>
					<view class="text">投递简历</view>
				</view>
				<view class="menuItem" v-if="LoginType == 2" @click="handleToCompany">
					<image class="img6" src="@/im/static/img/menu6.png"></image>
					<view class="text">查看企业</view>
				</view>
			</view>

			<!-- 聊天记录列表开启 -->
			<view class="imList">
				<view :class="isBottomMore ? 'imListInner ac' : 'imListInner'" ref="imListBox">
					<messageList ref="messageList" @handleMobileRefuse="handleMobileRefuse"
						@handleMobileAgree="handleMobileAgree" @handleWechatRefuse="handleWechatRefuse"
						@handleWechatAgree="handleWechatAgree" @sendReturnReceiptAll="sendReturnReceiptAll">
					</messageList>
				</view>
				<view :class="isBottomMore ? 'imIpt ac' : 'imIpt'">
					<view class="iptBox">
						<view class="shortcut" @click.stop="handleBottmeMore('phrase')">常用语</view>
						<view :class="isSend ? 'ipt' : 'ipt ac'">
							<input class="uni-input" cursor-spacing="50" :maxlength="-1" :cursor="cursorIndex"
								v-model="msgText" @focus="handleFocus" @blur="handleBlur" type="text"
								placeholder="新信息" />
						</view>
						<view class="emoji" @click.stop="handleBottmeMore('emoji')">
							<image src="@/im/static/img/emoji.png"></image>
						</view>
						<view :class="isBottomMore ? isSend ? 'more none' : 'more ac' : isSend ? 'more none' : 'more'"
							@click.stop="handleBottmeMore('more')">
							<image src="@/im/static/img/more.png"></image>
						</view>

						<view :class="isSend ? 'send ac' : 'send'" @click.stop="sendText">发送</view>
					</view>

					<view class="moreWrapper">
						<!-- 表情 -->
						<view class="emojiBox" v-if="isBottomText == 'emoji'">
							<scroll-view scroll-y="true" class="scroll">
								<view class="scrollInner">
									<view class="emojiItem" @click.stop="handleEmoji(item)"
										v-for="(item, index) in emojiAry" :key="index">{{ item }}</view>
								</view>
							</scroll-view>
						</view>
						<!-- 更多 -->
						<view class="moreBox" v-if="isBottomText == 'more'">
							<view class="moreItem" v-if="LoginType == 1" @click.stop="handleSendMap">
								<image src="@/im/static/img/more1.png"></image>
								<view class="text">发送位置</view>
							</view>

							<view class="moreItem" v-if="LoginType == 2" @click.stop="handleSendResume">
								<image src="@/im/static/img/more7.png"></image>
								<view class="text">发送简历</view>
							</view>

							<view class="moreItem" v-if="LoginType == 1" @click="openSelectJobDialot">
								<image src="@/im/static/img/more2.png"></image>
								<view class="text">切换职位</view>
							</view>

							<view class="moreItem" @click.stop="openToppingDialog">
								<image src="@/im/static/img/more3.png"></image>
								<view class="text">{{ stick == 1 ? '取消置顶' : '置顶聊天' }}</view>
							</view>

							<view class="moreItem" v-if="LoginType == 1" @click.stop="openInvitationDialog">
								<image src="@/im/static/img/more4.png"></image>
								<view class="text">邀请投递</view>
							</view>

							<view class="moreItem" v-if="LoginType == 2" @click="openInterviewListDialog">
								<image src="@/im/static/img/more8.png"></image>
								<view class="text">面试安排</view>
							</view>

							<view class="moreItem" @click.stop="handleSendVideoInterview">
								<image src="@/im/static/img/more5.png"></image>
								<view class="text">视频面试</view>
							</view>

							<view class="moreItem" @click.stop="openBlackDialog">
								<image src="@/im/static/img/more6.png"></image>
								<view class="text">屏蔽聊天</view>
							</view>
						</view>

						<!-- 常用语列表 phraseList -->
						<view class="phraseWrapper" v-if="isBottomText == 'phrase'">
							<view class="list">
								<scroll-view scroll-y="true" style="height: 100%;">
									<view class="item substring" v-for="(item, index) in phraseList" :key="item.id"
										@click="handlePhrase(item)">{{ item.content }}</view>
								</scroll-view>
							</view>
							<view class="btns">
								<view class="btn" @click="handlePhraseAdd"><text class="icon icon1">添加</text></view>
								<view class="btn" @click="handleJump('/im/managePhrase')"><text
										class="icon icon2">管理</text></view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 聊天记录列表结束 -->
		</view>
		<!-- 置顶弹窗提示  -->
		<Popup ref="toppingDialog" :showCancelButton="true" title="系统提示" @confirm="handleTopping">
			<view class="POPUP_PADDING">
				{{ toppingText }}
			</view>
		</Popup>
		<!-- 屏蔽聊天窗口 -->
		<Popup ref="blackDialog" title="系统提示" :showCancelButton="true" @confirm="handleblack">
			<view class="POPUP_PADDING">
				{{ blackText }}
			</view>
		</Popup>
		<!-- 聊天过程中解除屏蔽  -->
		<Popup ref="processBlack" title="系统提示" :showCancelButton="isInBlackObj.cancel_enable == 1 ? false : true"
			:confirmText="isInBlackObj.cancel_enable == 1 ? '解除屏蔽' : '确认'" @confirm="handleProcessAddBlack">
			<view class="POPUP_PADDING">
				{{ processBlackText }}
			</view>
		</Popup>
		<!-- 邀请投递投递 -->
		<Popup ref="invitationDialog" :showCancelButton="true" title="系统提示" @confirm="handleInvitationDelivery">
			<view class="POPUP_PADDING">确定邀请对方投递简历吗？</view>
		</Popup>
		<!-- 投递简历弹窗 -->
		<Popup ref="menuTopDialog" :showCancelButton="true" title="系统提示" @confirm="topMenuJobApplyAdd">
			<view class="POPUP_PADDING">是否投递简历？</view>
		</Popup>
		<!-- 交换电话弹窗 -->
		<Popup ref="exchangMobileDialog" :showCancelButton="true" title="交换手机号" @confirm="handleExchangeMobile">
			<view class="POPUP_PADDING">
				确认与对方交换电话吗？
			</view>
		</Popup>
		<!-- 交换微信弹窗开启 -->
		<Popup ref="exchangWechatDialog" :showCancelButton="true" class="exchangWechatDialog" title="交换微信号"
			@confirm="handleExchangeWechat">
			<view class="POPUP_PADDING" style="padding-left: 40rpx;padding-right: 40rpx;">
				<u-input :border="true" class="wechatIpt" v-model="wechatText" placeholder="请输入微信号" type="text"
					:clearable="false"></u-input>
			</view>
		</Popup>
		<!-- 切换职位 -->
		<jobDialog ref="jobDialog" type="changejob" @handleChangeJob="handleChangeJob" :jobId="showParams.jobid"
			:istab="false" :companyId="showParams.companyid"></jobDialog>
		<!-- 面试安排弹窗 -->
		<u-popup ref="interviewDialog" type="center" :is-mask-click="false">
			<view class="interviewBox" v-if="imInterviewInfoList.length > 0">
				<swiper class="swiperBox" :current="0">
					<swiper-item class="swiperItem" v-for="(item, index) in imInterviewInfoList" :key="index">
						<view :class="item.isOverdue ? 'itemInner beOverdue' : 'itemInner'">
							<view class="title">面试安排</view>
							<view class="content">
								<view class="itemConT">
									<view class="lable">面试职位：</view>
									<view class="text">{{ item.jobname }}</view>
								</view>
								<view class="itemConT">
									<view class="lable">面试时间：</view>
									<view class="text ">{{ item.interview_time }}</view>
								</view>
								<view class="itemConT">
									<view class="lable">联系方式：</view>
									<view class="text">{{ item.tel }}</view>
								</view>
								<view class="itemConT">
									<view class="lable">面试地址：</view>
									<view class="text">{{ item.address }}</view>
								</view>
								<view class="itemConT">
									<view class="lable">备注信息：</view>
									<view class="text">{{ item.note }}</view>
								</view>
							</view>
							<view class="btn" @click="closePopup">确认</view>
						</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="interviewBox" v-else>
				<view class="itemInner">
					<view class="title">面试安排</view>
					<view class="content noList">该企业未向您发出面试邀请</view>
					<view class="btn" @click="closePopup">确认</view>
				</view>
			</view>
		</u-popup>

		<!-- 下载简历弹窗 -->
		<Popup ref="downResumeDialog" :showCancelButton="true" title="系统提示" @confirm="downResume" confirmBtnText="简历下载">
			<view class="POPUP_PADDING">您需要下载简历才能发起发起面试邀请， 是否去简历详情下载简历？</view>
		</Popup>
		<!-- 联系客服 -->
		<!-- <CustomerServiceDialog ref="customerServiceDialog"></CustomerServiceDialog> -->

		<!-- 强制绑定微信公众号弹窗  -->
		<Popup class="bindWxWrapper" ref="bindWx" :maskCloseAble="false" title="系统提示" @confirm="handleImCheckBind">
			<view class="bindWx">
				<view class="title1">您当前未绑定微信，绑定后可发起聊天。</view>
				<view class="img">
					<image class="qrcode" :show-menu-by-longpress='true' :src="bindWxImg"></image>
				</view>
				<view class="title2">使用微信扫一扫，按提示快速绑定</view>
			</view>
		</Popup>
		<!-- 简历完善度不足引导完善简历 -->
		<Popup ref="perfectResume" :showCancelButton="true" title="系统提示" @confirm="jumpResume">
			<view style="padding:20rpx 0">
				当前简历完善度不足请前去完善简历
			</view>
		</Popup>
		<!-- 职聊功能未开启弹窗提示 -->
		<Popup ref="imDisabled" title="系统提示" :maskCloseAble="false" @confirm="handleDisabled">
			<view style="padding:40rpx 0">
				{{ imDisabledText }}
			</view>
		</Popup>
	</view>
</template>

<script>
	import http from '@/utils/http'
	import api from '@/api'
	import messageList from '@/im/components/messageList.vue';
	import jobDialog from '@/im/components/jobDialog.vue';
	// import CustomerServiceDialog from '@/components/CustomerServiceDialog.vue';
	import {
		gcToDb
	} from '@/utils/map.js';
	import {
		data
	} from '@/static/emoji.json';
	// import {resumeShow, resumedownload } from '@/utils/api.js';
	import {
		mapState,
		mapMutations,
		mapActions
	} from 'vuex';
	export default {
		data() {
			return {
				// 表情数组
				emojiAry: data.split(','),
				// 底部更多操作开启
				isBottomMore: false,
				// 底部操作 区分点击的是标签还是更多 emoji(表情)/more(更多)
				isBottomText: 'more',
				// 输入内容
				msgText: '',
				// 列表页面传递参数
				showParams: {},
				//文本框失去焦点记录光标位置
				cursorIndex: 0,
				// 是否展示发送按钮
				isSend: false,
				// 置顶提示语句
				toppingText: '',
				//是否置顶
				stick: 1,
				//屏蔽聊天提示语
				blackText: '',
				// 聊天过程中被屏蔽提示语
				processBlackText: '',
				// 取消/设置黑名单
				isBlackList: false,
				// 微信号
				wechatText: '',
				// 同意交换微信号数据
				WechatAgreeData: {},
				// 聊天记录列表
				imInterviewInfoList: [],
				// 常用语列表
				phraseList: [],
				// 是否需要下载简历
				show_contact: 0,
				// 发送位置 地图选择是否成功
				isSendMap: false,
				sendMapMsgStr: '',
				// 绑定二维码图片
				bindWxImg: '',
				// 职聊未开启提示语文字
				imDisabledText: '',
				lastTopChatId: '', // 置顶最后一个id 用于添加下边框
				loading: true
			};
		},
		components: {
			messageList,
			jobDialog
			// CustomerServiceDialog
		},
		computed: {
			...mapState(['LoginType', 'imToken', 'isInBlackObj', 'chatId', 'colorTheme'])
		},
		onLoad(o) {
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.on('acceptDataFromOpenerPage', (data) => {
				this.showParams = data
				this.stick = this.showParams.stick
				this.imWindowGlobal()
				if (this.LoginType == 1) {
					this.getRecommendShowData();
				}
			})
		},
		onShow() {
			if (this.imToken != '') {
				this.getPhrase();
			}
		},
		watch: {
			isInBlackObj: {
				handler(val) {
					// newVal.cancel_enable
					// 1 "您已屏蔽对方，如需继续聊天请先解除屏蔽。"
					// 0  "您已被对方加入黑名单，无法继续与TA聊天哦。"
					if (val.message) {
						this.processBlackText = val.message;
						this.$nextTick(() => {
							this.$refs.processBlack.open();
						});
					}
				},
				immediate: true,
				deep: true
			},
			msgText(val) {
				if (val != '') {
					this.isSend = true;
				} else {
					this.isSend = false;
				}
			},
			imToken(val) {
				if (val != '') {
					this.getPhrase();
				}
				// 发送位置 会导致token消失 在此监听token是否请求成功请求成功则发送地图
				if (val != '' && this.isSendMap) {
					let msgStr = JSON.parse(this.sendMapMsgStr)
					msgStr.args.token = val
					let newMsgStr = JSON.stringify(msgStr)
					setTimeout(() => {
						this.$ws.send(newMsgStr)
					}, 500)
				}
			}
		},
		methods: {
			...mapMutations(['setImSelfAvatar', 'setBlackObj', 'setImTargetUserinfo']),
			...mapActions(['webSocket_send']),
			// 职聊功能未开启弹窗
			handleDisabled() {
				if (this.LoginType == 1) {
					uni.navigateTo({
						url: '/company/CompanyIndex'
					});
				} else {
					uni.navigateTo({
						url: '/personal/PersonalIndex'
					});
				}
			},
			// 完善简历跳转
			jumpResume() {
				uni.navigateTo({
					url: '/pages/personal/resumeIndex/resumeIndex'
				});
			},
			// 检测是否绑定公众号
			handleImCheckBind() {
				http.get(api.imCheckBind).then(res => {
					if (res.data.data != 0) {
						this.imWindowGlobal();
					} else {
						// 1企业 2个人
						if (this.LoginType == 1) {
							uni.navigateTo({
								url: '/pages/company/companyIndex'
							});
						} else {
							uni.navigateTo({
								url: '/pages/personal/personalIndex'
							});
						}
					}
				});
			},
			/**
			 * 即时通讯进入界面时全局检测
			 * disabled 不能使用功能
			 * bind_weixin绑定微信
			 * complete_resume完善简历
			 * 空字符串 正常使用
			 * choose_job选择职位
			 * pay需要购买增值服务，触屏是快捷支付
			 */
			imWindowGlobal() {
				http.get(api.im_window_global).then((res) => {
					if (parseInt(res.data.code) == 200) {
						// next 为空可以使用聊天
						if (res.data.data.next == '') {
							// 获取用户详情
							this.getUserInfo()
							// 获取会话列表 查找当前与那个用户聊天
							this.getChatList()
							// 检测是否在黑名单中
							// this.handleIsBlackList()
						}
						if (res.data.data.next == 'bind_weixin') {
							// 绑定微信
							// #ifdef MP-WEIXIN
							this.getBIndWximage();
							// #endif
							// #ifdef MP-TOUTIAO
							this.lastTopChatId = '';
							this.getChatList();
							// #endif
							return false;
						}
						if (res.data.data.next == 'complete_resume') {
							// 编辑简历
							this.$nextTick(() => {
								this.loading = false;
							});
							// 打开完善简历弹窗提示
							this.$refs.perfectResume.open();
							return false;
						}
						if (res.data.data.next == 'disabled') {
							// 职聊未开启
							this.imDisabledText = res.data.message;
							this.$refs.imDisabled.open();
							this.$nextTick(() => {
								this.loading = false;
							});
							return false;
						}
					}
				})
			},
			// 获取微信绑定二维码图片
			getBIndWximage() {
				http.get(api.get_qrcode, {
					type: 'bind_weixin'
				}).then(res => {
					if (res.data.code == 200) {
						this.bindWxImg = res.data.data;
						this.$nextTick(() => {
							this.loading = false;
							this.$refs.bindWx.open();
						});
					}
				});
			},
			// 简历详情
			getRecommendShowData() {
				http.get(api.resumeshow, {
					id: this.showParams.resumeid
				}).then(res => {
					if (res.data.code == 200) {
						let {
							base_info,
							show_contact
						} = res.data.data;
						this.show_contact = show_contact;
						this.baseInfo = base_info;
					}
				});
			},
			// 添加常用语
			handlePhraseAdd() {
				if (this.phraseList.length >= 15) {
					uni.showToast({
						title: '最多添加15条常用语',
						icon: 'none'
					});
					return false;
				}
				uni.navigateTo({
					url: '/im/phrase?type=add'
				});
			},
			//跳转
			handleJump(url) {
				uni.navigateTo({
					url: url
				});
			},
			// 常用语点击
			handlePhrase(item) {
				this.msgText = item.content;
			},
			// 获取常用语列表
			getPhrase() {
				http.post(api.phraseList, {
					token: this.imToken
				}).then(res => {
					if (res.data.code == 200) {
						let {
							items
						} = res.data.data
						this.phraseList = items
					}
				});
			},
			// 底部 表情/更多切换 底部开启
			handleBottmeMore(type) {
				if (type == 'more' && this.isBottomMore == true) {
					this.isBottomMore = false
				} else {
					this.isBottomMore = true
				}
				this.isBottomText = type;
			},
			// 文本框获得焦点
			handleFocus() {
				//  输入内容时将消息置底
				this.isSend = true;
				this.$nextTick(() => {
					this.$refs.messageList.updataToView();
				});
			},
			// 文本框失去焦点
			handleBlur(e) {
				if (this.msgText == '') {
					this.isSend = false;
				}
				this.cursorIndex = e.target.cursor;
			},
			// 发送文字消息
			sendText() {
				if (this.msgText === '') {
					return false;
				}
				var msgObj = {
					controller: 'SendText',
					action: 'index',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid,
						content: this.msgText
					}
				};
				// var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj)
				this.msgText = '';
			},
			// 表情点击
			handleEmoji(emoji) {
				let str = this.msgText.substring(0, this.cursorIndex);
				// 将表情插入指定位置
				this.msgText = this.msgText.replace(str, str + emoji);
				// 光标向后移动两位
				this.cursorIndex += 2; //光标加2(表情是占两个位置)
			},
			//发送位置
			handleSendMap() {
				var that = this;
				uni.chooseLocation({
					success(res) {
						let map = gcToDb(res.latitude, res.longitude);
						var msgObj = {
							controller: 'SendMap',
							action: 'index',
							args: {
								token: that.imToken,
								chatid: that.showParams.chatid,
								lat: map.lat,
								lng: map.lng,
								title: res.name,
								address: res.address
							}
						};
						var msgStr = JSON.stringify(msgObj);
						this.webSocket_send(msgObj);
						that.sendMapMsgStr = msgStr
						that.isSendMap = true
					},
					fail(err) {
						that.isSendMap = false
					}
				});
			},
			// 获取用户聊天信息
			getUserInfo() {
				http.get(api.im_userinfo).then(res => {
					this.setImSelfAvatar(res.data.data.avatar);
				});
			},
			// 获取聊天列表
			getChatList() {
				http.post(api.chatList, {
					token: this.imToken
				}).then(res => {
					if (res.data.code == 200) {
						// 获取当前聊天用户数据
						let currentUser = res.data.data.items.filter(items => {
							// if (items.chat_id == this.imChatid) {
							// 	this.stick = items.stick
							// }
							return items.chat_id == this.chatId;
						})[0];
						this.setImTargetUserinfo(currentUser);
					}
				});
			},
			// 打开置顶聊天弹窗
			openToppingDialog() {
				if (this.showParams.stick == 0) {
					this.showParams.stick = 1;
					this.toppingText = '确认把' + this.showParams.name + '设为置顶？';
				} else {
					this.showParams.stick = 0;
					this.toppingText = '确认把' + this.showParams.name + '取消置顶？';
				}
				this.$refs.toppingDialog.open();
			},
			// 置顶确认
			handleTopping() {
				this.stick = this.showParams.stick;
				http.post(api.chatStick, {
					token: this.imToken,
					chat_id: this.showParams.chatid,
					stick: this.stick
				}).then(res => {
					if (res.data.code == 200) {
						let title = this.stick == 0 ? '取消成功' : '置顶成功';
						uni.showToast({
							title: title,
							icon: 'success'
						});
					}
				});
			},
			// 屏蔽弹窗
			openBlackDialog() {
				if (this.isBlackList == false) {
					let utype_cn = this.LoginType == 1 ? '个人' : '企业';
					this.blackText = '屏蔽' + utype_cn + '后，该' + utype_cn + '将无法与您继续沟通，如需解除屏蔽，请在职聊设置里修改。';
					this.$refs.blackDialog.open();
				} else {
					uni.showToast({
						title: '已在黑名单中请勿重复添加',
						icon: 'none'
					});
				}
			},
			// 屏蔽确认
			handleblack() {
				http.post(api.add_blacklist, {
					token: this.imToken,
					chatid: this.showParams.chatid,
					jobname: this.jobname
				}).then(res => {
					if (res.data.code == 200) {
						this.isBlackList = true;
						uni.showToast({
							title: '屏蔽成功',
							icon: 'success'
						});
					} else {
						this.isBlackList = false;
					}
				});
			},
			// 聊天过程中被加入黑名单处理
			handleProcessAddBlack() {
				if (this.isInBlackObj.cancel_enable == 1) {
					http.post(api.del_blacklist, {
						token: this.imToken,
						chatid: this.showParams.chatid
					}).then(res => {
						this.setBlackObj({
							chatid: '',
							cancel_enable: '2',
							message: ''
						});
						this.isBlackList = false;
					});
				} else if (this.isInBlackObj.cancel_enable == 0) {
					this.setBlackObj({
						chatid: '',
						cancel_enable: '2',
						message: ''
					});
				}
			},
			// 视频面试
			handleSendVideoInterview() {
				uni.showToast({
					title: '功能正在开发中'
				});
			},
			// 邀请投递弹窗开启
			openInvitationDialog() {
				this.$refs.invitationDialog.open();
			},
			// 邀请投递确认
			handleInvitationDelivery() {
				var msgObj = {
					controller: 'SendInvite',
					action: 'invite',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 发送简历
			handleSendResume() {
				var msgObj = {
					controller: 'SendResume',
					action: 'index',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 跳转简历
			handleToResume() {
				uni.navigateTo({
					url: '/commonViews/ResumeShow?id=' + this.showParams.resumeid
				});
			},
			// 查看企业
			handleToCompany() {
				uni.navigateTo({
					url: '/commonViews/CompanyShow?id=' + this.showParams.companyid
				});
			},
			// 投递简历
			openTopMenuDialog() {
				this.$refs.menuTopDialog.open();
			},
			// 顶部投递简历弹窗确认
			topMenuJobApplyAdd() {
				http.post(api.jobApplyAdd, {
					jobid: this.showParams.jobid
				}).then(res => {
					if (res.data.code == 200) {
						uni.showToast({
							title: res.data.message,
							icon: 'success'
						});
					}
				});
			},
			// 交换电话弹窗开启
			openExchangMobileDialog() {
				this.$refs.exchangMobileDialog.open();
			},
			// 交换手机号确认
			handleExchangeMobile() {
				var msgObj = {
					controller: 'SendMobile',
					action: 'apply',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 交换手机号拒绝
			handleMobileRefuse(mobile) {
				var msgObj = {
					controller: 'SendMobile',
					action: 'refuse',
					args: {
						token: this.imToken,
						messageid: mobile.messageid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 交换手机号同意
			handleMobileAgree(mobile) {
				var msgObj = {
					controller: 'SendMobile',
					action: 'agree',
					args: {
						token: this.imToken,
						messageid: mobile.messageid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 交换微信号弹窗开启
			openExchangWechatDialog() {
				this.$refs.exchangWechatDialog.open();
			},
			// 交换微信弹窗确认
			handleExchangeWechat() {
				if (this.wechatText == '') {
					return false;
				}
				if (!this.WechatAgreeData.messageid) {
					let msgObj = {
						controller: 'SendWechat',
						action: 'apply',
						args: {
							token: this.imToken,
							chatid: this.showParams.chatid,
							wechat: this.wechatText
						}
					};
					var msgStr = JSON.stringify(msgObj);
					this.webSocket_send(msgObj);
				} else {
					let msgObj = {
						controller: 'SendWechat',
						action: 'agree',
						args: {
							token: this.imToken,
							messageid: this.WechatAgreeData.messageid,
							wechat: this.wechatText
						}
					};
					var msgStr = JSON.stringify(msgObj);
					this.webSocket_send(msgObj);
				}
				this.wechatText = '';
			},
			//交换微信号拒绝
			handleWechatRefuse(wechat) {
				var msgObj = {
					controller: 'SendWechat',
					action: 'refuse',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid,
						messageid: wechat.messageid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},

			// 交换微信号同意
			handleWechatAgree(wechat) {
				this.WechatAgreeData = wechat;
				this.$refs.exchangWechatDialog.open();
			},
			// 面试邀请
			handleInvitation() {
				var that = this
				if (this.show_contact == 0) {
					this.$refs.downResumeDialog.open();
				} else {
					uni.navigateTo({
						url: '/commonViews/AddInvitation',  //ResumeManagement/AddInvitationIndex
						success(res) {
							res.eventChannel.emit('acceptDataFromOpenerPage', {
								apply_fullname: that.baseInfo.fullname,
								resume_id: that.baseInfo.id,
							})
						}
					});
				}
			},
			// 下载简历
			downResume() {
				if (this.baseInfo.audit != 1) {
					uni.showToast({
						title: '该简历还未审核通过，不能继续此操作',
						icon: 'none'
					});
					return false;
				}
				const params = {
					resume_id: this.showParams.resumeid
				};
				var that = this
				http.post(api.company_downresume_list, params).then(res => {
					if (res.data.code == 200) {						
						this.getRecommendShowData();
						if (res.data.data.done == 0) {
							uni.showToast({
								title: '您的下载简历点数不足,请联系客服',
								icon: 'none'
							});
							setTimeout(() => {
								// this.$refs.customerServiceDialog.open();
							}, 1600);
						} else {
							uni.navigateBack({
								delta: 1
							})
						}
					}
				});
			},
			// 切换职位
			handleChangeJob(jobItem) {
				this.showParams.jobid = jobItem.id;
				var msgObj = {
					controller: 'SendJob',
					action: 'index',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj);
			},
			// 打开选择职位弹窗
			openSelectJobDialot() {
				this.$refs.jobDialog.getJobList();
			},
			// 打开面试安排弹窗
			openInterviewListDialog() {
				http.post(api.im_interview_info, {
					resumeid: this.showParams.resumeid,
					jobid: this.showParams.jobid
				}).then(res => {
					if (res.data.code == 200) {
						let {
							items
						} = res.data.data;
						this.imInterviewInfoList = items;
						this.imInterviewInfoList.forEach(item => {
							let oldTime = new Date(item.interview_time).getTime();
							let curTime = new Date().getTime();
							item.isOverdue = false;
							if (curTime > oldTime) {
								item.isOverdue = true;
							}
						});
						this.$refs.interviewDialog.open();
					}
				});
			},
			// 关闭面试安排弹窗
			closePopup() {
				this.$refs.interviewDialog.close();
			},
			//点开聊天详情页面发送回执
			sendReturnReceiptAll() {
				var msgObj = {
					controller: 'SendReturnReceipt',
					action: 'all',
					args: {
						token: this.imToken,
						chatid: this.showParams.chatid
					}
				};
				var msgStr = JSON.stringify(msgObj);
				this.webSocket_send(msgObj)
			}
		}
	};
</script>
<style lang="scss" scoped>
	page {
		overflow: hidden;
	}

	.imShowWrapper {
		width: 100%;
		height: 100%;
		background: #faf7fa;
		overflow: hidden;

		.imTitle {
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			font-size: 30rpx;
		}

		.exchangWechatDialog {
			::v-deep.dialogContent {
				padding: 20rpx 48rpx 40rpx;
			}

			.wechatIpt {
				::v-deep.uni-input-placeholder {
					padding-left: 20rpx;
				}

				::v-deep.uni-input-input {
					padding-left: 20rpx;
				}
			}
		}

		.imListWrapper {
			// height: calc(100% - 138rpx);
			height: 100%;
			position: relative;

			.menu {
				display: flex;
				align-items: center;
				justify-content: center;
				background: #fff;
				padding: 40rpx 0;

				.menuItem {
					flex: 1;
					text-align: center;

					.img1 {
						width: 27rpx;
						height: 37rpx;
					}

					.img2 {
						width: 38rpx;
						height: 32rpx;
					}

					.img3 {
						width: 30rpx;
						height: 30rpx;
					}

					.img4 {
						width: 28rpx;
						height: 33rpx;
					}

					.img5 {
						width: 28rpx;
						height: 33rpx;
					}

					.img6 {
						width: 36rpx;
						height: 31rpx;
					}

					.text {
						color: #999999;
						font-size: 28rpx;
						word-break: break-all;
					}
				}
			}

			.imList {
				height: calc(100% - 162rpx);
				position: relative;
				overflow: hidden;

				.imListInner {
					height: calc(100% - 110rpx);
					transform: translateY(0);
					transition: all 0.3s;

					&.ac {
						transform: translateY(-435rpx);
					}
				}

				.imIpt {
					// border-top: 1rpx solid #ededed;
					box-shadow: 0rpx 2rpx 60rpx 0rpx rgba(208, 208, 208, 0.26);
					background: #ffffff;
					position: absolute;
					left: 0;
					bottom: 0rpx;
					right: 0;
					transform: translateY(435rpx);
					transition: transform 0.3s;

					&.ac {
						transform: translateY(0);
					}

					.iptBox {
						display: flex;
						align-items: center;
						padding: 30rpx 36rpx;
						border-bottom: 1rpx solid #ededed;

						.shortcut {
							background: #1787fb;
							color: #fff;
							font-size: 28rpx;
							text-align: center;
							padding: 10rpx 20rpx;
							border-radius: 5rpx;
							margin-right: 20rpx;
							white-space: nowrap;
						}

						.ipt {
							margin-right: 20rpx;
							width: 370rpx;

							&.ac {
								width: 386rpx;
							}
						}

						.emoji {
							flex-shrink: 0;
							width: 51rpx;
							height: 51rpx;
							margin-right: 25rpx;

							image {
								width: 100%;
								height: 100%;
							}
						}

						.more {
							flex-shrink: 0;
							width: 51rpx;
							height: 51rpx;
							transition: transform 0.3s;
							transform: rotate(45deg);

							&.ac {
								transform: rotate(0);
							}

							image {
								width: 100%;
								height: 100%;
							}

							&.none {
								opacity: 0;
								width: 0rpx;

								image {
									width: 0;
								}
							}
						}

						.send {
							// background: $backgroundColor;
							background: #1787fb;
							color: #fff;
							font-size: 28rpx;
							padding: 0;
							border-radius: 5rpx;
							width: 0;
							height: 52rpx;
							line-height: 52rpx;
							opacity: 0;
							transition: padding 0.3s;
							white-space: nowrap;

							&.ac {
								width: auto;
								opacity: 1;
								padding: 0rpx 15rpx;
							}
						}
					}

					.moreWrapper {
						.emojiBox {
							height: 435rpx;
							padding: 20rpx 26rpx 0;
							box-sizing: border-box;

							.scroll {
								height: 100%;

								.scrollInner {
									display: flex;
									flex-wrap: wrap;
								}
							}

							.emojiItem {
								flex: 0 0 14.2%;
								text-align: center;
								font-size: 40rpx;
								text-align: center;
								margin-bottom: 20rpx;
							}
						}

						.moreBox {
							display: flex;
							flex-wrap: wrap;
							padding: 40rpx 36rpx 0rpx;

							.moreItem {
								display: flex;
								flex-flow: column;
								margin-right: 76rpx;
								margin-bottom: 40rpx;

								&:nth-child(4n) {
									margin-right: 0;
								}

								image {
									width: 100rpx;
									height: 100rpx;
									margin: 0 auto 15rpx;
								}

								.text {
									color: #333333;
									font-size: 28rpx;
									text-align: center;
								}
							}
						}

						.phraseWrapper {
							height: 432rpx;

							.list {
								height: 340rpx;
								padding: 0 36rpx;

								.item {
									padding: 34rpx 0;
									border-bottom: 1rpx solid #ededed;
									color: #383838;
									font-size: 30rpx;
								}
							}

							.btns {
								display: flex;
								padding: 35rpx 0;
								box-shadow: 0rpx 1rpx 60rpx 0rpx rgba(208, 208, 208, 0.26);

								.btn {
									flex: 1;
									display: flex;
									align-items: center;
									justify-content: center;
									font-size: 28rpx;

									.icon {
										padding-left: 45rpx;

										&.icon1 {
											background: url('@/im/static/img/editPhrase.png') no-repeat left center / 31rpx 31rpx;
										}

										&.icon2 {
											background: url('@/im/static/img/manage.png') no-repeat left center / 31rpx 31rpx;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}

	.interviewBox {
		width: 600rpx;
		min-height: 496rpx;

		::v-deep.uni-swiper-wrapper {
			overflow: visible;
		}

		::v-deep.uni-swiper-item {
			overflow: visible;
		}

		.swiperBox {
			min-height: 496rpx;
			width: 100%;

			::v-deep .uni-swiper-wrapper {
				min-height: 496rpx;

				::v-deep .uni-swiper-slides {
					min-height: 496rpx;

					::v-deep .uni-swiper-slide-frame {
						min-height: 496rpx;
						height: auto !important;
					}
				}
			}

			.swiperItem {
				min-height: 496rpx;
				height: auto !important;
				width: 100%;
			}
		}

		.itemInner {
			height: 100%;
			margin: 0 20rpx;
			background: #fff;
			border-radius: 30rpx;
			overflow: hidden;

			&.beOverdue {
				background: #fff url('@/im/static/img/InterviewArrange.png') no-repeat 420rpx 20rpx / 120rpx 106rpx;
			}

			.title {
				text-align: center;
				padding: 30rpx 30rpx 0;
				color: #333;
				font-size: 34rpx;
				font-weight: bold;
			}

			.content {
				min-height: 290rpx;
				padding: 36rpx 36rpx 0rpx;

				&.noList {
					padding: 0 36rpx 36rpx;
					text-align: center;
					// background: url('@/static/img/empty-image-dynamic.svg') no-repeat center 20rpx / 160rpx 150rpx;
					box-sizing: border-box;
					padding-top: 180rpx;
					color: #969799;
					min-height: 200rpx;
					font-size: 28rpx;
				}

				.itemConT {
					display: flex;
					padding: 2rpx 0;
					margin-bottom: 5rpx;

					.lable {
						color: #999999;
						font-size: 28rpx;
						width: 150rpx;
						flex-shrink: 0;
					}

					.text {
						color: #333333;
						font-size: 28rpx;
						white-space: normal;
						word-break: break-all;
					}
				}
			}

			.btn {
				text-align: center;
				color: #333;
				font-size: 28rpx;
				padding: 30rpx 0;
				border-top: 1rpx solid #ededed;
				font-weight: bold;
			}
		}
	}

	::v-deep.uni-input-placeholder {
		font-size: 28rpx !important;
	}

	.addInvitation {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		transform: translateX(100%);
		z-index: 10052;
		background-color: #fff;
		transition: all .5s;

		&.ac {
			transform: translateX(0%);
		}
	}

	.bindWxWrapper {
		::v-deep.dialogContent {
			padding: 16rpx 40rpx 52rpx;
		}

		.bindWx {
			padding: 40rpx 0;

			.title1 {
				color: #646566;
				font-size: 26rpx;
			}

			.img {
				width: 240rpx;
				height: 240rpx;
				margin: 20rpx auto;

				.qrcode {
					width: 100%;
					height: 100%;
				}
			}

			.title2 {
				color: #646566;
				font-size: 26rpx;
			}
		}
	}
</style>